<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
  <ul class="list">
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
  </ul>  
<script>
/*
1.给每个li标签添加一段文字:这是第几行
2.单行文字红色，双行文字绿色
*/
//是单数 返回 true 是双数 返回 false
function isOdd(n){
    if(n % 2 === 0){
        return false
    }else{
        return true
    }
}


let liList = document.querySelectorAll(".list li") //用变量存储li的数组 无论后期加多少个li都能随机应变
//console.log(liList)

//i表示每一个li的下标，因为i从0开始，所以一共有i+1行
for(let i = 0;i < liList.length;i++){
    let li = liList[i]
    //console.log(li)
    let j = i+1//j表示每一行的行序号
    li.innerText = `这是第${j}行`
    //判断当前行数是单还是双
    if(isOdd(i+1)){
        li.style.color = "red"
    }else{
        li.style.color = "pink"
    }
}


</script>
</body>
</html>